import React, { Component } from 'react';
import {
  AppRegistry,
  StyleSheet,
  Text,
  View
} from 'react-native';

/***
 * 定义组件的三种方式
 */

//ES6方式 导出并定义组件
export default class HelloComponent extends Component {
  // 代表UI部分 要渲染的界面
  render() {
    return <Text style={{ fontSize: 20, backgroundColor: 'blue' }}>ES6方式，Hello {this.props.name}</Text>
  }
}

//ES5方式 导出并定义组件
/* var HelloComponent = React.createClass({
  render() {
    return <Text style={{fontSize:20, backgroundColor:'red'}}>ES5方式，Hello WMan!</Text>
  }
})
module.exports=HelloComponent; */

//通过函数式的方式定义，无状态的  不能使用this
/* function HelloComponent(props){
	return <Text style={{fontSize:20, backgroundColor:'red'}}>函数方式，Hello {props.name}</Text>
}
module.exports=HelloComponent; */